import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:tender_flutter/constant/app_constant.dart';
import 'package:tender_flutter/constant/resource_path.dart';
import 'package:tender_flutter/constant/theme_colors.dart';
import 'package:tender_flutter/page/home/tender_list_page.dart';
import 'package:tender_flutter/router/router.dart';
import 'package:tender_flutter/router/router_map.gr.dart';
import 'package:tender_flutter/utils/screen_adaper.dart';
import 'package:tender_flutter/widgets/round_tab_indicator.dart';
import 'package:tender_flutter/widgets/sticky_tabbar_delegate.dart';

class RailwayPage extends StatefulWidget {
  @override
  _RailwayPageState createState() => _RailwayPageState();
}

class _RailwayPageState extends State<RailwayPage>
    with SingleTickerProviderStateMixin {
  List<String> _tabs;
  List<Widget> _listViews;

  /// 控制器
  TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabs = ['招标公告', '中标公告'];
    _listViews = [
      TenderListPage(tenderType: AppConstant.TENDERTYPE_RAILWAY),
      TenderListPage(tenderType: AppConstant.TENDERTYPE_RAILWAYWINNING)
    ];
    _tabController = TabController(
      length: _tabs.length,
      vsync: this,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(body: _initBody());
  }

  /// 导航
  Widget _initAppBar() {}

  /// 内容
  Widget _initBody() {
    return NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverOverlapAbsorber(
              handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
              sliver: SliverAppBar(
                centerTitle: true,
                forceElevated: innerBoxIsScrolled,
                leading: FlatButton(
                  child: Icon(
                    Icons.arrow_back_ios_rounded,
                    color: ThemeColors.colorWhite,
                  ),
                  onPressed: () {
                    LRouter.navigatorCtx(context).pop();
                  },
                ),
                //是否随着滑动隐藏标题
                floating: false,
                expandedHeight: ScreenAdapter.height(330),
                elevation: 1,
                //是否显示阴影，直接取值innerBoxIsScrolled，展开不显示阴影，合并后会显示
                // forceElevated: false,
                //是否固定在顶部
                pinned: true,
                //可折叠的应用栏
                flexibleSpace: FlexibleSpaceBar(
                  background: Container(
                    color: ThemeColors.colorWhite,
                    padding: EdgeInsets.only(
                        bottom: kToolbarHeight / 2 + ScreenAdapter.height(25)),
                    child: Image.asset(RPath.imgPath + "img_railway_zone.png",
                        fit: BoxFit.cover),
                  ),
                  title: _initSearchBar(),
                  titlePadding: EdgeInsets.zero,
                  centerTitle: true,
                  collapseMode: CollapseMode.parallax,
                ),
              ),
            ),
            SliverPersistentHeader(
              pinned: true,
              delegate: StickyTabBarDelegate(
                minHeight: 45,
                maxHeight: 50,
                child: _initTabBar(),
              ),
            )
          ];
        },
        body: Container(

            /// 注意：此处设置偏移是因为SliverAppBar的 pinned设置为了true，不设置会导致列表向上偏移
            margin: EdgeInsets.only(
                top: ScreenAdapter.statusBarHeight() + kToolbarHeight),
            child: TabBarView(
              controller: _tabController,
              children: _listViews,
            )));
  }

  /// 搜索框
  Widget _initSearchBar() {
    final double topPadding = MediaQuery.of(context).padding.top;
    return GestureDetector(
        onTap: () {
          LRouter.navigatorCtx(context).push(Routes.searchListPage,
              arguments: SearchListPageArguments(isShowCity: false,
                  tenderType: AppConstant.TENDERTYPE_RAILWAY_SEARCH));
        },
        child: Container(
          height: kToolbarHeight + topPadding,
          // color: ThemeColors.colorType6,
          width: ScreenAdapter.screenWidth() - 2 * ScreenAdapter.width(80),
          child: Container(
            height: double.infinity,
            // width: double.infinity,
            margin: EdgeInsets.only(
                left: ScreenAdapter.width(20),
                right: ScreenAdapter.width(20),
                top: topPadding + ScreenAdapter.height(15),
                bottom: ScreenAdapter.height(15)),
            // margin: EdgeInsets.symmetric(
            //     horizontal: ScreenAdapter.width(20),
            //     vertical: ScreenAdapter.height(25)),
            decoration: BoxDecoration(
                color: ThemeColors.colorWhite,
                borderRadius:
                    BorderRadius.all(Radius.circular(ScreenAdapter.width(14))),
                boxShadow: [
                  BoxShadow(
                    blurRadius: 0.8, //阴影范围
                    spreadRadius: 0.2, //阴影浓度
                    color: ThemeColors.colorType21, //阴影颜色
                  ),
                ]),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Image.asset(RPath.imgPath + "icon_gray_search.png",
                    width: ScreenAdapter.width(25)),
                SizedBox(width: ScreenAdapter.width(18)),
                Text(
                  "请输入招标关键词进行搜索",
                  style: TextStyle(
                      color: ThemeColors.colorType3,
                      fontSize: ScreenAdapter.sp(22)),
                ),
              ],
            ),
          ),
        ));
  }

  /// 初始化tabBar
  Widget _initTabBar() {
    return Container(
      color: ThemeColors.colorWhite,
      child: TabBar(
        onTap: ((index) {
          debugPrint('click item is $index');
        }),
        indicator: RoundUnderlineTabIndicator(
            borderSide: BorderSide(
          width: 5,
          color: ThemeColors.colorType6,
        )),
        labelStyle: TextStyle(
          fontSize: ScreenAdapter.sp(35),
          fontWeight: FontWeight.w600,
        ),
        unselectedLabelStyle: TextStyle(
          fontSize: ScreenAdapter.sp(35),
          fontWeight: FontWeight.w600,
        ),
        labelColor: ThemeColors.colorType8,
        unselectedLabelColor: ThemeColors.colorType7,
        controller: _tabController,
        tabs: _tabs
            .map((e) => Tab(
                  child: Container(
                    child: Text(e),
                    padding: const EdgeInsets.only(
                      bottom: 10,
                    ),
                  ),
                ))
            .toList(),
      ),
    );
  }

  // /// 列表
  // Widget _initListView(String key, Widget listView) {
  //   return Builder(
  //     builder: (BuildContext context) {
  //       return CustomScrollView(
  //         key: PageStorageKey<String>(key),
  //         slivers: <Widget>[
  //           SliverOverlapInjector(
  //             handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
  //           ),
  //           SliverPadding(
  //             padding: const EdgeInsets.all(10.0),
  //             sliver: SliverToBoxAdapter(
  //               child: listView,
  //             ),
  //           ),
  //         ],
  //       );
  //     },
  //   );
  // }
}
